<template>
  <div class="publicformview">
    <el-form :rules='rules' label-width='120px' :inline="true" :model="listQuery" :disabled='blockType==3' size="mini" ref="addForm" style="margin-top: 20px;">
      <div class="publicformview-row">
        <el-form-item label="归属管片：" prop="blockgroup">
          <el-select v-model="listQuery.blockgroup" filterable>
            <div v-for="(item,index) in guanpianList" :key="index">
              <el-option :disabled='item.status!=0' :label="item.groupnew" :value="item.groupnew" :key="index"></el-option>
            </div>
          </el-select>
        </el-form-item>
        <el-form-item label="房屋地址：" prop="address">
          <el-input v-model="listQuery.address"></el-input>
        </el-form-item>
        <el-form-item label="是否可售：" prop="issell">
          <el-select v-model="listQuery.issell">
            <el-option label="可售" value="1" key="1"></el-option>
            <el-option label="不可售" value="0" key="0"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="管理形式：" prop="manageway">
          <el-select v-model="listQuery.manageway" @change='guanliChange'>
            <div v-for="(item,index) in guanlixingshiList" :key="index">
              <el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
            </div>
          </el-select>
					
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="建档单位：" prop="creatingdept">
          <el-select v-model="listQuery.creatingdept" :disabled='isNodetile'>
            <div v-for="(item,index) in bumenList" :key="index">
              <el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
            </div>
          </el-select>
        </el-form-item>
        <el-form-item label="所号：" prop="blockno">
          <el-input v-model="listQuery.blockno"></el-input>
        </el-form-item>
       <!-- <el-form-item label="代码：" prop="creatingdeptno">
          <el-input v-model="listQuery.creatingdeptno"></el-input>
        </el-form-item> -->
        <el-form-item label="类型： " prop="blockmain">
          <el-select v-model="listQuery.blockmain">
            <el-option label="主体" value="主体" key="1"></el-option>
            <el-option label="附属" value="附属" key="0"></el-option>
          </el-select>
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="启始日期：" prop="startdate">
          <el-date-picker disabled v-model="listQuery.startdate" type="date" placeholder="年/月/日">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="启始原因： " prop="startcause">
          <el-select v-model="listQuery.startcause">
            <div v-for="(item,index) in qishiyuanyingList" :key="index">
              <el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
            </div>
          </el-select>
        </el-form-item>
        <template v-if="blockType==3">
          <el-form-item label="终止日期：" prop="stopdate">
            <el-date-picker v-model="listQuery.stopdate" type="date" placeholder="年/月/日">
            </el-date-picker>
					<el-tooltip class="item" effect="dark" content="输入“终止日期”表示，该条纪录已经终止，即在统计时，减少一所。否则，“终止日期”保持为NULL值。
" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
          </el-form-item>
          <el-form-item label="终止原因：" prop="stopcause">
            <el-select v-model="listQuery.startcause">
              <div v-for="(item,index) in zhongzhiList" :key="index">
                <el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
              </div>
            </el-select>
          </el-form-item>
        </template>
        <template v-if="blockid">
          <el-form-item label="变动日期：" prop="changedate">
            <el-date-picker v-model="listQuery.changedate" type="date" placeholder="年/月/日">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="变动原因：" prop="changecause">
            <el-select v-model="listQuery.changecause">
              <div v-for="(item,index) in biandongList" :key="index">
                <el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
              </div>
            </el-select>
          </el-form-item>
        </template>
      </div>
      <div class="publicformview-row">
        <el-form-item label="产别：" prop="ownway">
          <el-select v-model="listQuery.ownway" :disabled='listQuery.ownway=="直管公产"'>
            <div v-for="(item,index) in chanbieList" :key="index">
              <el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
            </div>
          </el-select>
					
        </el-form-item>
        <el-form-item label="嘱接部门：" prop="owndept">
          <el-input v-model="listQuery.owndept"></el-input>
        </el-form-item>
        <el-form-item label="产权单位：" prop="cqdw">
          <!-- 	<el-select v-model="listQuery.cqdw">
							<div v-for="(item,index) in chanquandanweiList" :key="index">
								<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
							</div>
						</el-select> -->
          <el-input disabled v-model="listQuery.cqdw"></el-input>
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="来文号：" prop="receivefileno1">
          <el-input v-model="listQuery.receivefileno1"></el-input>
        </el-form-item>
        <el-form-item label="通知日期：" prop="informdate">
          <el-date-picker v-model="listQuery.informdate" type="date" placeholder="年/月/日">
          </el-date-picker>
        </el-form-item>
        <template :span="6" v-if="blockid">
          <el-form-item label="地号：" prop="fieldno">
            <el-input v-model="listQuery.fieldno"></el-input>
          </el-form-item>

        </template>
      </div>
      <div class="publicformview-row">
        <el-form-item label="收文号：" prop="receivefileno2">
          <el-input v-model="listQuery.receivefileno2"></el-input>
        </el-form-item>
        <el-form-item label="接管日期：" prop="takeoverdate">
          <el-date-picker v-model="listQuery.takeoverdate" type="date" placeholder="年/月/日">
          </el-date-picker>
        </el-form-item>
        <template :span="6" v-if="blockid">
          <el-form-item label="土地证号：" prop="fieldidno">
            <el-input disabled v-model="listQuery.fieldidno"></el-input>
          </el-form-item>
        </template>
      </div>
      <div class="publicformview-row">
        <el-form-item label="原产权人：" prop="originowner">
          <el-input v-model="listQuery.originowner"></el-input>
        </el-form-item>
        <el-form-item label="起租日期：" prop="startrentdate">
          <el-date-picker v-model="listQuery.startrentdate" type="date" placeholder="年/月/日">
          </el-date-picker>
        </el-form-item>
        <template :span="6" v-if="blockid">
          <el-form-item label="房产证号：" prop="estateidno">
            <el-input v-model="listQuery.estateidno"></el-input>
          </el-form-item>
        </template>
      </div>

      <div class="publicformview-row">
        <el-form-item label=" 自来水移交：" prop="watertransfer">
          <el-select v-model="listQuery.watertransfer">
            <el-option label="是" value="是"></el-option>
            <el-option label="否" value="否"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="移交日期：" prop="watertransferdate">
          <el-date-picker v-model="listQuery.watertransferdate" type="date" placeholder="年/月/日">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="管理日期：" prop="managedate">
          <el-date-picker v-model="listQuery.managedate" type="date" placeholder="年/月/日">
          </el-date-picker>
        </el-form-item>
      </div>

      <div class="publicformview-row">
        <el-form-item label="接管前历史沿革情况：" prop="beforetakeoverhis" label-width="180px">
          <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.beforetakeoverhis" style="width: 300px">
          </el-input>
        </el-form-item>
        <el-form-item label="其他产权情况(接管前)：" prop="beforetakeoverotherown" label-width="180px">
          <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.beforetakeoverotherown" style="width: 300px">
          </el-input>

        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="其他产权情况(接管后)：" prop="aftertakeoverotherown" label-width="180px">
          <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.aftertakeoverotherown" style="width: 300px">
          </el-input>
        </el-form-item>
        <el-form-item label="备注：" prop="blockmemo1" label-width="180px">
          <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.blockmemo1" style="width: 300px">
          </el-input>
        </el-form-item>
      </div>
    </el-form>
    <div class="bottomTop" v-if='blockType!=3'>
      <el-button type="primary" size="mini" @click="handleAddUser">保存</el-button>
    </div>
  </div>

</template>

<script>
import dayjs from 'dayjs'
import {
  blockGroupList,
  houseAdminList,
  addBlockDetail,
  blockDetail,
  updBlockDetail,
  getBLockNo,
  getArea
} from '@/api/industry'
export default {
  props: {
    blockType: String,
    blockid: String
  },
  name: 'canquanqingkuang',
  data() {
    return {
      listQuery: {
        blockgroup: '',
        address: '',
        creatingdeptno: '',
        creatingdept: '',
        blockno: '',
        issell: '',
        blockmain: '',
        startdate: '',
        startrentdate: '',
        startcause: '',
        stopcause: '',
        manageway: '',
        ownway: '',
        owndept: '',
        receivefileno1: '',
        informdate: '',
        fieldno: '',
        receivefileno2: '',
        takeoverdate: '',
        fieldidno: '',
        originowner: '',
        stopdate: '',
        estateidno: '',
        changecause: '',
        changedate: '',
        cqdw: '',
        watertransfer: '',
        watertransferdate: '',
        managedate: '',
        beforetakeoverhis: '',
        beforetakeoverotherown: '',
        aftertakeoverotherown: '',
        blockmemo1: ''
      },
      rules: {
        blockgroup: [
          {
            required: true,
            message: '请选择归属管片',
            trigger: 'blur'
          }
        ]
      },
      total: 0,
      options: [
        {
          key: '1'
        }
      ],
      listLoading: false,
      dialogVisible: false,
      // 管片列表
      guanpianList: [],
      chanyeList: [],
      // 建档单位
      bumenList: [],
      // 产别
      chanbieList: [],
      // 启始原因
      qishiyuanyingList: [],
      // 终止原因
      zhongzhiList: [],
      // 变动原因
      biandongList: [],
      // 管理形式
      guanlixingshiList: [],
      // 产权单位
      chanquandanweiList: [],
      isNodetile: false
    }
  },

  computed: {},
  watch: {
    'listQuery.ownway': {
      handler(newVal, oldVal) {
        if (newVal == '直管公产') {
          this.listQuery.cqdw = '天津市人民政府'
        } else {
          this.listQuery.cqdw = '代管产'
        }
      }
    }
  },

  mounted() {
    getArea().then((res) => {
    	if(localStorage.getItem('userHouseAdminId')>0){
    		this.listQuery.creatingdept = localStorage.getItem('userHouseAdminName')
    		this.isNodetile = true
    	}else{
    		this.bumenList = res.data
    	}
    })

    // 遍历字典
    this.chanyeList = JSON.parse(localStorage.getItem('chanye'))
    this.chanyeList.forEach((item, index) => {
      if (item.classname == '档案变动') {
        item.classmidList.forEach((it, idx) => {
          if (it.classmid == '所档案变动') {
            this.biandongList = it.classdetailList
          }
        })
      } else if (item.classname == '产别') {
        item.classmidList.forEach((it, idx) => {
          if (it.classmid == '产别') {
            this.chanbieList = it.classdetailList
          }
        })
      } else if (item.classname == '启始原因') {
        this.qishiyuanyingList = item.classmidList
      } else if (item.classname == '终止原因') {
        this.zhongzhiList = item.classmidList
      } else if (item.classname == '管理形式') {
        this.guanlixingshiList = item.classmidList
      } else if (item.classname == '产权单位') {
        this.chanquandanweiList = item.classmidList
      }
    })

    if (this.blockid) {
      let data = {
        BlockID: this.blockid
      }
      blockDetail(data).then((res) => {
        this.listQuery = res.data
        if (this.listQuery.blockmain == 1) {
          this.listQuery.blockmain = '主体'
        } else {
          this.listQuery.blockmain = '附属'
        }
      })
    } else {
      // 初始化时间
      this.listQuery.startdate = dayjs().format('YYYY-MM-DD HH:mm:ss')
      this.listQuery.changedate = dayjs().format('YYYY-MM-DD HH:mm:ss')
      // getBLockNo().then((res) => {
      //   this.listQuery.blockno = res.data
      this.listQuery.blockno = ''
      // getBLockNo().then((res) => {
      //
    }
    this.blockGroupList()

    if (localStorage.getItem('chanquanqingkuang')) {
      this.listQuery = JSON.parse(localStorage.getItem('chanquanqingkuang'))
    }
  },

  methods: {
    // 管片列表
    blockGroupList() {
      let data = {
        group: '',
        groupNumber: '',
        houseAdmin: '',
        pageNum: '',
        pageSize: 99999
      }
      this.listLoading = true
      blockGroupList(data).then((res) => {
        this.guanpianList = res.data.list
        this.listLoading = false
      })
    },
    resetForm(val) {
      this.$refs[val].resetFields()
    },
    handleAddUser(type) {
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          let data = {
            blockgroup: this.listQuery.blockgroup,
            address: this.listQuery.address,
            // creatingdeptno: this.listQuery.creatingdeptno,
            creatingdept: this.listQuery.creatingdept,
            blockno: this.listQuery.blockno,
            issell: this.listQuery.issell,
            blockmain: this.listQuery.blockmain == '主体' ? 1 : 0,
            startdate: this.listQuery.startdate
              ? dayjs(this.listQuery.startdate).format('YYYY-MM-DD HH:mm:ss')
              : '',
            startrentdate: this.listQuery.startrentdate
              ? dayjs(this.listQuery.startrentdate).format(
                  'YYYY-MM-DD HH:mm:ss'
                )
              : '',
            startcause: this.listQuery.startcause,
            stopcause: this.listQuery.stopcause,
            manageway: this.listQuery.manageway,
            takeoverdate: this.listQuery.takeoverdate
              ? dayjs(this.listQuery.takeoverdate).format('YYYY-MM-DD HH:mm:ss')
              : '',
            ownway: this.listQuery.ownway,
            owndept: this.listQuery.owndept,
            receivefileno1: this.listQuery.receivefileno1,
            informdate: this.listQuery.informdate
              ? dayjs(this.listQuery.informdate).format('YYYY-MM-DD HH:mm:ss')
              : '',
            fieldno: this.listQuery.fieldno,
            receivefileno2: this.listQuery.receivefileno2,
            fieldidno: this.listQuery.fieldidno,
            originowner: this.listQuery.originowner,
            stopdate: this.listQuery.stopdate
              ? dayjs(this.listQuery.stopdate).format('YYYY-MM-DD HH:mm:ss')
              : '',
            estateidno: this.listQuery.estateidno,
            changecause: this.listQuery.changecause,
            changedate: this.listQuery.changedate
              ? dayjs(this.listQuery.changedate).format('YYYY-MM-DD HH:mm:ss')
              : '',
            cqdw: this.listQuery.cqdw,
            watertransfer: this.listQuery.watertransfer,
            watertransferdate: this.listQuery.watertransferdate
              ? dayjs(this.listQuery.watertransferdate).format(
                  'YYYY-MM-DD HH:mm:ss'
                )
              : '',
            managedate: this.listQuery.managedate
              ? dayjs(this.listQuery.managedate).format('YYYY-MM-DD HH:mm:ss')
              : '',
            beforetakeoverhis: this.listQuery.beforetakeoverhis,
            beforetakeoverotherown: this.listQuery.beforetakeoverotherown,
            aftertakeoverotherown: this.listQuery.aftertakeoverotherown,
            blockmemo1: this.listQuery.blockmemo1,
            blockid: this.blockid ? this.blockid : -1
          }
          // if(this.listQuery.watertransfer=='是'){
          // 	data.watertransferdate = this.listQuery.watertransferdate?dayjs(this.listQuery.watertransferdate).format('YYYY-MM-DD HH:mm:ss'):''
          // }
          localStorage.setItem('chanquanqingkuang', JSON.stringify(data))
          if (this.blockType == 2 || this.blockType == 4) {
            updBlockDetail(data).then((res) => {
              this.$message(res.message)
              localStorage.setItem('blockid', res.data.blockid)
              localStorage.setItem('blockno', res.data.blockno)
              // this.$router.go(-1)
            })
          } else {
            addBlockDetail(data).then((res) => {
              this.$message(res.message)
              localStorage.setItem('blockid', res.data.blockid)
              localStorage.setItem('blockno', res.data.blockno)
              // this.$router.go(-1)
            })
          }
        } else {
          console.log('验证失败！')
          return false
        }
      })
    },
    returns() {
      this.$router.go(-1)
    },
    // 选择类型
    selectButton(type) {
      this.type = type
    },
    //选择管理形式
    guanliChange(value) {
      this.chanyeList.forEach((item, index) => {
        if (item.classname == '管理形式') {
          item.classmidList.forEach((it, idx) => {
            if (value == '直管' && it.classmid == '直管') {
              this.chanbieList = it.classdetailList
              this.listQuery.ownway = '直管公产'
            } else if (value == '代管' && it.classmid == '代管') {
              this.chanbieList = it.classdetailList
              this.listQuery.ownway = ''
            }
          })
        }
      })
    }
  },
  beforeDestroy() {
    let data = {
      blockgroup: this.listQuery.blockgroup,
      address: this.listQuery.address,
      // creatingdeptno: this.listQuery.creatingdeptno,
      creatingdept: this.listQuery.creatingdept,
      blockno: this.listQuery.blockno,
      issell: this.listQuery.issell,
      blockmain: this.listQuery.blockmain,
      startdate: this.listQuery.startdate
        ? dayjs(this.listQuery.startdate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      startrentdate: this.listQuery.startrentdate
        ? dayjs(this.listQuery.startrentdate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      startcause: this.listQuery.startcause,
      stopcause: this.listQuery.stopcause,
      manageway: this.listQuery.manageway,
      takeoverdate: this.listQuery.takeoverdate
        ? dayjs(this.listQuery.takeoverdate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      ownway: this.listQuery.ownway,
      owndept: this.listQuery.owndept,
      receivefileno1: this.listQuery.receivefileno1,
      informdate: this.listQuery.informdate
        ? dayjs(this.listQuery.informdate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      fieldno: this.listQuery.fieldno,
      receivefileno2: this.listQuery.receivefileno2,
      fieldidno: this.listQuery.fieldidno,
      originowner: this.listQuery.originowner,
      stopdate: this.listQuery.stopdate
        ? dayjs(this.listQuery.stopdate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      estateidno: this.listQuery.estateidno,
      changecause: this.listQuery.changecause,
      changedate: this.listQuery.changedate
        ? dayjs(this.listQuery.changedate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      cqdw: this.listQuery.cqdw,
      watertransfer: this.listQuery.watertransfer,
      watertransferdate: this.listQuery.watertransferdate
        ? dayjs(this.listQuery.watertransferdate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      managedate: this.listQuery.managedate
        ? dayjs(this.listQuery.managedate).format('YYYY-MM-DD HH:mm:ss')
        : '',
      beforetakeoverhis: this.listQuery.beforetakeoverhis,
      beforetakeoverotherown: this.listQuery.beforetakeoverotherown,
      aftertakeoverotherown: this.listQuery.aftertakeoverotherown,
      blockmemo1: this.listQuery.blockmemo1,
      blockid: this.blockid ? this.blockid : -1
    }
    localStorage.setItem('chanquanqingkuang', JSON.stringify(data))
  }
}
</script>

<style scoped>
.headTop {
  width: 100%;
  display: flex;
  justify-content: space-between;

  .xinxi {
    display: flex;
    width: 800px;
  }
}

.el-form-item {
  justify-content: start !important;
}

.el-select {
  width: 180px;
}

.el-input {
  width: 180px;
}

.el-date-picker {
  width: 180px;
}

.bottomTop {
  width: 100%;
  display: flex;
  justify-content: end;
}

.tabButton {
  background: #eff2f7;
  color: #333333;
  border: none;
}

.tabButton {
  background: #eff2f7;
  color: #333333;
  border: none;
}

.publicformview-row {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

/deep/ .el-form-item--mini {
  width: unset;
}
</style>